<template>
    <div >
        <van-nav-bar
                :fixed="fixed"
                title="支付密码设置"
                left-text="返回"
                left-arrow
                @click-left="onClickLeft"
        />
        <div class="address" :style="{marginTop: '46px'}">
                <van-cell-group>
                    <van-field
                            v-model="password"
                            type="password"
                            label="支付密码"
                            placeholder="请输入支付密码"
                    />
                    <van-field
                            v-model="password2"
                            type="password"
                            label="请再次输入"
                            placeholder="请再次输入支付密码"
                    />
                </van-cell-group>
                <div :style="{padding:'10px',marginTop:'10px'}">
                    <van-button size="large" @click="showData">确定</van-button>
                </div>
        </div>

    </div>
</template>

<script>
    import {PaySetting} from "../api/data";
    import Vue from 'vue'
    import { Toast } from 'vant';
    Vue.use(Toast);
    export default {
        data () {
            return {
                fixed:true,
                password:'',
                password2:''
            }
        },
        methods: {
            showData() {//验证手机号码
               if (this.password.length<6){
                   Toast('支付密码不低于6位！')
                   return
               }
               if (this.password != this.password2){
                   Toast('两次密码输入不一致！')
                   return
               }
               let uid = JSON.parse(localStorage.getItem('user'))
                let user_id = uid.id
               PaySetting(user_id,this.password).then(res=>{
                   if (res.data.code == '10001') {
                       Toast('登录已失效，请重新登录！')
                       this.$router.push({path:`/login`})
                       localStorage.removeItem('token')
                       return
                   }
                   if (res.data.code==1){
                       Toast('支付密码设置成功！')
                       this.$router.back()
                   }else {
                       Toast('新密码和旧密码相同！')
                   }
               })
            },
            onClickLeft() {
                this.$router.back()
            }
        }
    }
</script>

<style scoped>
    .address{
        height: 100%;
        color:  rgb(153, 153, 153);
        margin-top: 50px;
    }
</style>
